import {DEFAULT_FORM_LAYOUT, DEFAULT_FORM_TAIL_LAYOUT} from "kf-web-library";
import type { KfFloatingContextProps } from 'kf-web-library';
import { modifyAuthPwd, modifyPwd } from '@/services/system/auth/AuthService';
import { Button, Form, Input, message, Spin } from 'antd';
import React, { useState } from 'react';
import * as API from "@/services";

type SubmitEntity = API.ModifyAuthPwd;
const FormItem = Form.Item;

interface ModifyPasswordFormProps extends KfFloatingContextProps {
    auth?: API.Auth;
}

const ModifyPasswordForm: React.FC<ModifyPasswordFormProps> = (props) => {
    const [loading, setLoading] = useState(false);
    const [form] = Form.useForm();

    return (
        <Spin spinning={loading} tip="正在加载数据,请稍候..." delay={500}>
            <Form
                {...DEFAULT_FORM_LAYOUT}
                form={form}
                onFinish={(values) => {
                    setLoading(true);
                    let processPromise;
                    if (props.auth) {
                        processPromise = modifyAuthPwd({
                            ...values,
                            authId: props.auth.id,
                        } as API.ModifyAuthPwd);
                    } else {
                        processPromise = modifyPwd({ ...values } as API.ModifyPwd);
                    }

                    processPromise
                        .then((res) => {
                            if (res.flag) {
                                message.success('密码更改成功');
                                props.closeWrapFloating && props.closeWrapFloating(true);
                            } else {
                                setLoading(false);
                            }
                        })
                        .finally(() => {
                            setLoading(false);
                        });
                }}
            >
                <FormItem name={nameof<SubmitEntity>((x) => x.oldPasswd)} label="原密码" rules={[{ required: true }]}>
                    <Input.Password />
                </FormItem>

                <FormItem
                    name={nameof<SubmitEntity>((x) => x.newPasswd)}
                    label="新密码"
                    rules={[
                        {
                            required: true,
                            pattern: /(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[^a-zA-Z0-9]).{8,32}$/,
                            message: '密码必须包含大写字母、数字、特殊字符且至少8位',
                        },
                    ]}
                >
                    <Input.Password />
                </FormItem>

                <Form.Item
                    name="confirmPassword"
                    label="确认新密码"
                    dependencies={['newPasswd']}
                    hasFeedback
                    rules={[
                        {
                            required: true,
                        },
                        ({ getFieldValue }) => ({
                            validator(rule, value) {
                                if (!value || getFieldValue('newPasswd') === value) {
                                    return Promise.resolve();
                                }
                                return Promise.reject('与新密码不一致!');
                            },
                        }),
                    ]}
                >
                    <Input.Password />
                </Form.Item>

                <Form.Item {...DEFAULT_FORM_TAIL_LAYOUT}>
                    <Button type="primary" htmlType="submit" disabled={loading}>
                        更改密码
                    </Button>
                </Form.Item>
            </Form>
        </Spin>
    );
};

export default ModifyPasswordForm;
